{extend name="shared/layout" /}
{block name="title"}新增课程{/block}
{block name="css"}{/block}
{block name="javascript"}
    <script type="text/javascript">
        function initTable() {
            //先销毁表格
            $('#tb').bootstrapTable('destroy');
            //初始化表格,动态从服务器加载数据
            $("#tb").bootstrapTable({
                method: "Post",  //使用Post请求到服务器获取数据
                url: "{:url('imagetext/getgroupList')}", //获取数据的Servlet地址
                striped: true,  //表格显示条纹
                pagination: true, //启动分页
                pageSize: 10,  //每页显示的记录数
                pageNumber: 1, //当前第几页
                pageList: [10, 20],  //记录数可选列表
                search: false,  //是否启用查询
                sortable: true, //是否启用排序
                sortOrder: "asc", //排序方式                
                sortable: true,                
                sidePagination: "server", //表示服务端请求                
                queryParamsType: "limit",
                contentType: "application/x-www-form-urlencoded",
                queryParams: function queryParams(params) {   //设置查询参数
                    var param = {
                        limit: params.limit,
                        offset: params.offset,
                        sortName: params.sort,
                        sortOrder: params.order,
                        keyword: $("input[name=keyword]").val()                      
                    };
                    return param;
                },
                onLoadSuccess: function () {  //加载成功时执行
                    
                },
                onLoadError: function () {  //加载失败时执行
                    layui.use(['layer'], function(){
                        layer.msg("加载数据失败", { time: 1500, icon: 2 });
                    });
                }
            });
        }
        
        $(document).ready(function () {
            //调用函数，初始化表格
            initTable();
            //当点击查询按钮的时候执行
            $("#search").bind("click", initTable);
            $("#cancel").bind("click", function () {
                parent.layer.close(parent.layer_sel_image_text_index);
            });
        });
        
        function operateFormatter(value, row, index) {
            var html = "";
            html += "<a href=\"javascript:select(" + index + ");\"><i class=\"fa fa-angellist text-navy\"></i>选择</a>";
            return html;
        }

        function select(idx){
            var row = $('#tb').bootstrapTable('getData')[idx];           
            if(typeof(parent.select_result)=="function")
                parent.select_result(row);
        }

        function contains(arr, obj) {
            var i = arr.length;
            while (i--) {
                if (arr[i] === obj) {
                return true;
                }
            }
            return false;
        }

        Date.prototype.format = function(format) {
            var date = {
                    "M+": this.getMonth() + 1,
                    "d+": this.getDate(),
                    "h+": this.getHours(),
                    "m+": this.getMinutes(),
                    "s+": this.getSeconds(),
                    "q+": Math.floor((this.getMonth() + 3) / 3),
                    "S+": this.getMilliseconds()
            };
            if (/(y+)/i.test(format)) {
                    format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
            }
            for (var k in date) {
                    if (new RegExp("(" + k + ")").test(format)) {
                            format = format.replace(RegExp.$1, RegExp.$1.length == 1
                                    ? date[k] : ("00" + date[k]).substr(("" + date[k]).length));
                    }
            }
            return format;
        }

        function dateFormat(index, row) {
            if(index==0) return "";
           var newDate = new Date();
            newDate.setTime(index * 1000);
            return newDate.format('yyyy-MM-dd h:m:s');
        }

        function rownumber(value, row, index){
            var options = $('#tb').bootstrapTable('getOptions');            
            return options.pageSize * (options.pageNumber - 1) + index + 1;
        }

        function titleFormatter(value,row,index){
            return "<a href='"+row.url+"' target='_blank'>"+value+"</a>";
        }
    </script>
{/block}
{block name="content"}
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>图文分组列表</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-9 m-b-xs">                                                         
                            </div>                        
                            <div class="col-sm-2">
                                <div class="input-group">
                                    <span class="input-group-btn">
                                        <input type="text" placeholder="请输入关键词" class="input-sm form-control" id="keyword" name="keyword">
                                        <button type="button" class="btn btn-sm btn-primary" id="search">搜索</button>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <table data-toggle="table" id="tb" data-pagination="true">
                            <thead>
                                <tr>
                                    <th data-field="number" data-align="center" data-formatter="rownumber">序号</th>
                                    <th data-field="name" data-align="center">标题</th>
                                    <th data-field="addtime" data-align="center" data-formatter="dateFormat">创建时间</th>
                                    <th data-align="center" data-formatter="operateFormatter">操作</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <div class="col-sm-12 col-sm-offset-5">
                            <button class="btn btn-white" id="cancel" type="button">取消</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{/block}